import 'package:bruno/bruno.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter_easyrefresh/easy_refresh.dart';
import 'package:get/get.dart';
import 'package:untitled/Page/home/home_bar/app_bar.dart';
import 'package:untitled/Page/home/topic_item.dart';

import 'home_page_controller.dart';

class HomePage extends GetView<HomePageController> {
  HomePage({super.key});
  var bannerTitle = ["精选话题", "推荐话题"];
  @override
  Widget build(BuildContext context) {
    return GetBuilder(
      init: HomePageController(),
      builder: (HomePageController ctl) => Scaffold(
          appBar: HomeBar(),
          body: EasyRefresh(
            controller: ctl.ctl,
            onRefresh: () async {
              await Future.delayed(const Duration(seconds: 2));
              ctl.ctl.finishRefresh();
              ctl.ctl.finishLoad();
            },
            onLoad: () async {
              await Future.delayed(const Duration(seconds: 2));
              ctl.ctl.finishRefresh();
              ctl.ctl.finishLoad();
            },
            child: CustomScrollView(
              slivers: [
                SliverToBoxAdapter(
                  child: SizedBox(
                    height: 300,
                    child: ListView(
                      padding: const EdgeInsets.fromLTRB(10, 0, 10, 0),
                      scrollDirection: Axis.horizontal,
                      children: [
                        Padding(
                            padding: const EdgeInsets.fromLTRB(20, 30, 20, 0),
                            child: BrnShadowCard(
                                color: Colors.white,
                                circular: 10,
                                child: SizedBox(
                                  width: 300,
                                  height: 280,
                                  child: Column(
                                    children: [
                                      ClipRRect(
                                        borderRadius: const BorderRadius.only(
                                            topLeft: Radius.circular(10),
                                            topRight: Radius.circular(10)),
                                        child: Container(
                                          height: 60,
                                          decoration: const BoxDecoration(
                                              color: Color.fromARGB(
                                                  255, 0, 128, 255)),
                                          child: const Align(
                                              alignment: Alignment.centerLeft,
                                              child: Padding(
                                                padding: EdgeInsets.fromLTRB(
                                                    20, 0, 0, 0),
                                                child: Text(
                                                  "精选话题",
                                                  style: TextStyle(
                                                      fontSize: 18,
                                                      color: Colors.white),
                                                ),
                                              )),
                                        ),
                                      ),
                                      Column(
                                        children: topicToplist(context),
                                      )
                                    ],
                                  ),
                                ))),

                        Padding(
                            padding: const EdgeInsets.fromLTRB(0, 30, 20, 0),
                            child: BrnShadowCard(
                                color: Colors.white,
                                circular: 10,
                                child: SizedBox(
                                  width: 300,
                                  height: 400,
                                  child: Column(
                                    children: [
                                      ClipRRect(
                                        borderRadius: const BorderRadius.only(
                                            topLeft: Radius.circular(10),
                                            topRight: Radius.circular(10)),
                                        child: Container(
                                          height: 60,
                                          decoration: const BoxDecoration(
                                              color: Color.fromARGB(
                                                  255, 186, 0, 0)),
                                          child: const Align(
                                              alignment: Alignment.centerLeft,
                                              child: Padding(
                                                padding: EdgeInsets.fromLTRB(
                                                    20, 0, 0, 0),
                                                child: Text(
                                                  "热门话题",
                                                  style: TextStyle(
                                                      fontSize: 18,
                                                      color: Colors.white),
                                                ),
                                              )),
                                        ),
                                      ),
                                      // ignore: prefer_const_constructors

                                      Column(
                                        children: topicToplist(context),
                                      ),
                                    ],
                                  ),
                                ))),

                        // Add more cards or widgets as needed
                      ],
                    ),
                  ),
                ),
                SliverList(
                  delegate: SliverChildBuilderDelegate(
                    (context, index) {
                      return topicClientLifelist(
                          context, ctl.topicDetails[index]);
                    },
                    childCount: ctl.topicDetails.length,
                  ),
                ),
              ],
            ),
          )),
    );
  }

  Widget headerBannerView(context, index) {
    return Padding(
        padding: const EdgeInsets.fromLTRB(20, 30, 20, 0),
        child: BrnShadowCard(
            color: Colors.white,
            circular: 10,
            child: SizedBox(
              width: 300,
              height: 280,
              child: Column(
                children: [
                  ClipRRect(
                    borderRadius: const BorderRadius.only(
                        topLeft: Radius.circular(10),
                        topRight: Radius.circular(10)),
                    child: Container(
                      height: 60,
                      decoration: BoxDecoration(
                          color: index == 0
                              ? const Color.fromARGB(255, 0, 128, 255)
                              : const Color.fromARGB(255, 186, 0, 0)),
                      child: Align(
                          alignment: Alignment.centerLeft,
                          child: Padding(
                            padding: const EdgeInsets.fromLTRB(20, 0, 0, 0),
                            child: Text(
                              bannerTitle[index],
                              style: const TextStyle(
                                  fontSize: 18, color: Colors.white),
                            ),
                          )),
                    ),
                  ),
                  Column(
                    children: topicToplist(context),
                  )
                ],
              ),
            )));
  }

  List<Widget> topicToplist(context) {
    List<Widget> vs = [];
    for (var element in controller.topicToplist) {
      vs.add(InkWell(
        onTap: () {
          BrnToast.show(element['topic_url'], context);
        },
        child: Row(
          children: [
            Padding(
                padding: const EdgeInsets.fromLTRB(10, 10, 0, 0),
                child: ClipRRect(
                  borderRadius: const BorderRadius.all(Radius.circular(100)),
                  child: Image.network(
                    element['avatar'],
                    width: 50,
                    height: 50,
                  ),
                )),
            Column(
              children: [
                Align(
                  alignment: Alignment.centerLeft,
                  child: Container(
                    padding: const EdgeInsets.fromLTRB(10, 10, 0, 0),
                    width: 220,
                    child: Text(element['title'],
                        style: const TextStyle(
                            fontWeight: FontWeight.w500, color: Colors.black)),
                  ),
                ),
                Align(
                  alignment: Alignment.centerLeft,
                  child: Container(
                      padding: const EdgeInsets.fromLTRB(10, 10, 0, 0),
                      width: 220,
                      child: Text(
                        element['message'],
                        style: const TextStyle(
                            fontWeight: FontWeight.w100, color: Colors.black54),
                        overflow: TextOverflow.ellipsis,
                      )),
                )
              ],
            ),
          ],
        ),
      ));
    }
    return vs;
  }

  Widget topicClientLifelist(context, element) {
    return TopicItem(
            element["nicname"],
            element["agrees"],
            element["time_tag"],
            element["avatar_url"],
            element["topic"],
            element["topic_imgs"],
            element["views"],
            element["comments"])
        .getItemView();
  }
}
